<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script type="text/javascript" src="static/js/jquery.min.js"></script>
    <script type="text/javascript"
            src="static/js/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap-treeview.min.css"
          th:href="@{static/js/bootstrap/css/bootstrap-treeview.min.css}"
    >
    <script src="static/js/bootstrap/js/bootstrap-treeview.min.js"></script>
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap.addtabs.css">
    <script src="static/js/bootstrap/js/bootstrap.addtabs.min.js"></script>
    <link rel="stylesheet" href="static//js/bootstrap/css/bootstrap-table.min.css">
    <script src="static/js/bootstrap/js/bootstrap-table.min.js"></script>
    <script src="static/js/bootstrap/js/bootstrap-table-zh-CN.min.js"></script>
    <script src="static/js/bootstrap/js/bootbox.js"></script>
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap-datetimepicker.min.css" />
    <script type="text/javascript"
            src="static/js/bootstrap/js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript"
            src="static/js/bootstrap/js/bootstrap-datetimepicker.zh-CN.js"></script>
    <script src="static/js/bootstrap-fileinput/js/fileinput.js"></script>
    <script src="static/js/bootstrap-fileinput/js/locales/zh.js"></script>
    <link rel="stylesheet" href="static/js/bootstrap-fileinput/css/fileinput.css">
</head>
<input type="hidden" class="form-control" th:value="${queryPictureId}" id="queryPictureId">
<input type="hidden" class="form-control" th:value="${productId}" id="productId">
<body onload="wzyForGetPictureParticulars()">
<div class="container"  style="width: 100%;">
    <div style="height: 50px;"><span id="productName"></span>
    </div>
    <b>定制产品</b>
    <hr>
    产品类别：<span id="productCategory"></span>
    <br>
    采购数量：<span id="productCount"></span>个
    <br><br>
    <b>详细定制要求</b>
    <hr>
    <table cellspacing="1px" border="1px" style="width: 80%">
        <tr>
            <td>
                <p style="background-color: #a6e1ec ;font-size: 20px"><b style="color: red">*</b>采购商信息</p>
            </td>
        </tr>
        <tr>
            <td>
                <table align="center" style="width: 80%;font-size: 20px">
                    <tr>
                        <td>联系人：</td>
                        <td><span id="userRealName"></span></td>
                        <td>联系方式：</td>
                        <td><span id="userPhone"></span></td>
                    </tr>

                    <tr>
                        <td>邮箱：</td>
                        <td><span id="userEmail"></span></td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td>
                <p style="background-color: #aae4ef ;font-size: 20px"><b style="color: #e51919">*</b>备注信息</p>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <span id="contactsRemark"></span>
            </td>
        </tr>
        <tr>
            <td>
                <p style="background-color: #a6e1ec ;font-size: 20px"><b style="color: red">*</b>附件</p>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <span id="contactsAccessory"></span>
            </td>
        </tr>
    </table>
    <br>
    <button class="btn btn-primary btn-lg" data-toggle="modal" onclick="orderReceiving()">我要接单</button>
</div>

</body>
<script>
    var id = $("#productId").val();
    var queryPictureId = $("#queryPictureId").val();

    /**
     * 跳转接单
     */
    function orderReceiving(){
        location.href="jumpToOrderReceiving?queryPictureId="+queryPictureId+"&pid="+id;
    }




    /**
     * 查询询图详细信息
     */
    function wzyForGetPictureParticulars(){
        $.ajax({
            url:'wzyForGetPictureParticulars?pid='+id,
            "dataType" : "json",
            "success" : function(data){
                var productName = document.getElementById("productName");
                var productCategory = document.getElementById("productCategory");
                var productCount = document.getElementById("productCount");
                var userRealName = document.getElementById("userRealName");
                var userPhone = document.getElementById("userPhone");
                var userEmail = document.getElementById("userEmail");

                var contactsRemark = document.getElementById("contactsRemark");
                var contactsAccessory = document.getElementById("contactsAccessory");




                userRealName.innerHTML+=data.product.contacts;
                userEmail.innerHTML+=data.product.contactsEmail;
                userPhone.innerHTML+=data.product.contactsPhone;
                productName.innerHTML+="<h2>"+data.product.productName+"</h2>";
                productCategory.innerHTML+=data.product.productCategory;
                productCount.innerHTML+=data.product.productCount;
                contactsRemark.innerHTML+=data.product.contactsRemark;
                contactsAccessory.innerHTML+=data.product.contactsAccessory;



            }

        })
    }






</script>
</html>